<template>
  <div>
    <MyHeader></MyHeader>
    <van-notice-bar
      v-if="warning_text"
      left-icon="volume-o"
      :text="warning_text"
    />
    <!--    <div class="header">-->
    <!--      疫情信息上报系统-->
    <!--    </div>-->
    <banner></banner>
    <news></news>

    <div>
      <div class="button">
        <van-button type="primary" size="large" @click="toPostInfo">核酸上报</van-button>
      </div>
      <div class="button">
        <van-button type="info" size="large" @click="toAntigenRecognition">抗原自测</van-button>
      </div>
    </div>

    <!--    <tabbar></tabbar>-->
  </div>
</template>

<script>
import Banner from "../components/banner.vue";
import News from "../components/news.vue";
import MyHeader from "../components/common/MyHeader.vue";

export default {
  name: "Home",
  components: {MyHeader, News, Banner},

  data() {
    return {
      warning_text: null,
    }

  },
  methods: {
    toPostInfo() {
      this.$router.push({name: "postinfo"})
    },
    toAntigenRecognition() {
      this.$router.push({name: "antigen_recognition"})
    }
  },

  created() {
    var userinfo =  JSON.parse(sessionStorage.getItem("userinfo"))
    if(userinfo.risk === 1) {
      this.warning_text = "注意，你已被设定为低危人员，请按照社区公示执行活动"
    } else if(userinfo.risk === 2) {
      this.warning_text = "警告，你已被设定为高危人员，请按照社区公示执行活动"
    }
  }

}
</script>

<style scoped>
.header {
  text-align: center;
  padding-top: 10px;
  color: #2b2b2b;
  font-size: 18px;
  background-color: rgba(25, 136, 249, 0.8);
  height: 40px;
}

.button {
  margin: 20px;
}

.van-button__text {
  font-size: 18px
}
</style>
